<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="../js/vue.js"></script>
		<script src="https://cdn.bootcss.com/jquery/1.10.1/jquery.js"></script>
	</head>
	<body>
		<div id="app">
			
			<p>{{msg}}</p>
			<button @click="del()">销毁</button>
		</div>
	<script>
		var vm=new Vue({
			el:"#app",
			data:{
				msg:'hello',
				arr:[]
			},
			methods:{
				init(){
					$.ajax({
						url:`http://bufantec.com/api/test/user/list`,
						method:'GET',
						success(data){
							console.log(data.data.list)
							this.arr=data.data.list
						}
					})
				},
				del(){
					this.$destroy()
				}
			},
			beforeCreate() {
				console.log(this.msg);
			},
			created() {
				console.log(this.msg);
				this.init();
			},
			beforeMount() {
				console.log(document.getElementsByTagName('p')[0].innerHTML)
			},
			mounted() {
				console.log(document.getElementsByTagName('p')[0].innerHTML)
			},
			beforeUpdate() {
				console.log('beforeUpdate')
			},
			updated() {
				console.log('updated')
			},
			beforeDestroy() {
				console.log('销毁之前');
			},
			destroyed() {
				console.log('销毁之后');
			}
		})
		
		
		
	</script>	
	</body>
</html>
